<template>
	<view class="content">
		<view class="list">
			<view class="opt" @click="linkTo('/pages/customNavigation/customNavigation')">自定义导航</view>
			<view class="opt" @click="linkTo('/pages/fileUpload/fileUpload')">文件上传</view>
			<view class="opt" @click="linkTo('/pages/fileUploadTwo/fileUploadTwo')">第二种文件上传</view>
			<view class="opt" @click="linkTo('/pages/switchCity/switchCity')">切换当前城市</view>
			<view class="opt" @click="linkTo('/pages/search/search')">联想搜索</view>
			<view class="opt" @click="clickVuex()">测试vuex</view>
			<view class="opt" @click="linkTo('/pages/seebigpicture/seebigpicture')">查看大图</view>
			<view class="opt" @click="linkTo('/pages/countdown/countdown')">倒计时列表</view>
			<view class="opt" @click="linkTo('/pages/calendar/calendar')">日历</view>
			<view class="opt" @click="linkTo('/pages/calendar/date')">日期添加天数得到新日期（YYYY-MM-DD）</view>
			<view class="opt" @click="linkTo('/pages/autograph/index')">签名</view>
			<view class="opt" @click="linkTo('/pages/input/input')">搜索框</view>
			<view class="opt" @click="linkTo(`/pages/scanCode/scanCode?text=${text}&type=${type}`)">扫码H5+ {{number}}</view>
			<view class="opt" @click="linkTo('/pages/camera/camera')">调用摄像头H5+</view>
			<ct-input :icon="false" placeholder="请输入搜索条件" :boxStyle="boxStyle" @search="search"></ct-input>
			<ct-button :btnNum="btnNum" :publicStyle="publicStyle" @trigger="trigger"></ct-button>
			<ct-tabs :list="list" @change="change"></ct-tabs>
			<ct-empty class="l-box-pa-l wh100 l-fcc" style="z-index: -1;"></ct-empty>
			<ct-area></ct-area>
			<ct-test>
				确认
				<template v-slot:header="{user}">
					{{user.lastName}}
				    <!-- <h1>Here might be a page title</h1> -->
				</template>
				<template v-slot:footer>
					<p>Here's some contact info</p>
				</template>
			</ct-test>
			
			<view class="opt" @click="linkTo('/pages/tabBar/tabBar')">tabBar导航</view>
		</view>
	</view>
</template>

<script>
	import ctInput from "@/components/input.vue";
	import ctButton from "@/components/button.vue";
	import ctTabs from "@/components/tabs.vue";
	import ctEmpty from "@/components/empty.vue";
	import ctArea from "@/components/comtextarea.vue"
	import ctTest from "@/components/test.vue"
	export default {
		data() {
			return {
				testNum:1,
				boxStyle: {
					'background': '#eeeeee'
				},
				publicStyle:{
					'border-radius': '10rpx',
					'btns': [{
						'name': '上次',
						'background': 'rgb(3, 16, 251)',
					}]
				},
				btnNum: [{
					'name':'拒绝',
					'background': 'rgb(86, 126, 25)',
				}],
				list: [{
					name: '待收货'
				}, {
					name: '待付款',
				}, {
					name: '待评价',
					count: 5
				}],
				isScroll: false,
				text: '页面上要显示的内容：这是一个自定义的扫码界面！',
				type:'scan-listener',
				result:'',//获取到的二维码内容，根据自己需求处理结果
				number: ''
			}
		},
		components:{ctInput, ctButton, ctTabs, ctEmpty, ctArea, ctTest},
		onLoad() {
			// #ifdef APP-PLUS
			// 父组件监听子组件事件的方法 $eventHub作为中间站(可以祖孙监听)main.js有配置
			this.$eventHub.$on(this.type, (data) => {
				console.log(data);
				this.$set(this, 'number',data.result)
			});
			// #endif
		},
		methods: {
			clickVuex() {
				let testVelut = this.$store.state.common.test;
				// this.$store.commit('changTest', '哈哈,真的改变了')
				// let testVelutTwo = this.$store.state.test;
				// console.log('testVelutTwo ==>', testVelutTwo)
				let three = this.$store.dispatch('actTest', '哈哈,这是异步改变')
				// console.log('test ==>', this.$store.getters.test)
				console.log('testVelut ==>', testVelut)
			},
			linkTo(e) {
				this.$Function.LinkTo(e)
			},
			search(e) {
				console.log('e ==>', e)
			},
			trigger(e) {
				console.log('e ==>', e)
			},
			change(e) {
				console.log('e ==>', e)
			},
		}
	}
</script>

<style lang="scss" scoped>
	
	.opt{ 
		height: 100rpx;line-height: 100rpx;border-bottom: 2rpx solid #f0f0f0;box-sizing: border-box;width: 100%;padding: 0 20rpx;
	}
</style>
